import { FC, useEffect, ReactElement } from 'react'
import { connect, EvaluationStateType, Loading, Dispatch, history } from 'umi'
import { Location } from 'history-with-query'
import styles from './index.less'

interface IProps {
  dispatch: Dispatch
  evaluationModel: EvaluationStateType
  evaluationLoding: Boolean
  location: Location
}

let Status = {
  0: '禁用',
  1: '资料收集',
  2: '专家评审',
  3: '审核',
  4: '归档'
}
const Arbitration: FC<IProps> = ({
  dispatch,
  evaluationModel,
  evaluationLoding,
  location
}): ReactElement => {
  const { type } = location.query as { type: string }
  const { evaluationList } = evaluationModel

  // 获取评价信息列表
  const getEvaluationList = () => {
    dispatch({
      type: 'evaluationModel/function_getBatchInfo',
      payload: {}
    })
  }

  // 仲裁入口
  const handleMark = (batchCode: string) => {
    history.replace({
      pathname: '/arbitration/resource',
      query: {
        batchCode
      }
    })
  }

  useEffect(() => {
    getEvaluationList()
  }, [])
  return (
    <>
      <div className={styles['assignment-wrapper']}>
        {evaluationList
          ?.filter((item) => item.status)
          .map((item) => (
            <div className={styles['evaluation-item']} key={item.code}>
              <div className={styles['module-title']}>
                <span>项目预览</span>
                <span className={styles.year}>
                  {new Date(item.createTime).getFullYear()}
                </span>
              </div>
              <div className={styles['module-content']}>
                <div className={styles['first-row']}>
                  <span className={styles['name']}>{item.name}</span>
                  <span className={styles['content']}>{item.content}</span>
                </div>
                <div className={styles['second-row']}>
                  <div className={styles['unit']}>
                    <span className={styles['label']}>发起单位: </span>
                    <span>{item.unit}</span>
                  </div>
                  <div>
                    <span className={styles['label']}>状态: </span>
                    <span>{Status[item.status]}</span>
                  </div>
                  <div></div>
                </div>

                <div
                  onClick={() => handleMark(item.code)}
                  className={styles.entrance}
                >
                  仲裁入口&gt;&gt;&gt;&gt;&gt;
                </div>
              </div>
            </div>
          ))}
      </div>
    </>
  )
}

const mapStateToProps = ({
  evaluationModel,
  loading
}: {
  evaluationModel: EvaluationStateType
  loading: Loading
}) => {
  return {
    evaluationModel,
    evaluationLoding: loading.models.evaluationModel
  }
}

export default connect(mapStateToProps)(Arbitration)
